<template>
  <div class="swiper-container banner" ref="banner">
    <div class="swiper-wrapper">
      <div class="swiper-slide" v-for="(v, i) in bannerList" :key="i">
        <img :src="v" alt="" />
      </div>
    </div>
  </div>
</template>

<script>
import Swiper from "swiper";
import "swiper/swiper-bundle.css";
export default {
  name: "Banner",
  props: {
    bannerList: {
      type: Array,
      default() {
        return [
          require("../assets/logo.png"),
          require("../assets/logo.png"),
          require("../assets/logo.png")
        ];
      }
    }
  },
  mounted() {
    new Swiper(this.$refs.banner);
  }
};
</script>

<style scoped>
.banner {
  width: 100%;
  height: 100%;
}
img {
  width: 100%;
  height: 100%;
}
</style>